<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/js/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/css/common.css" media="all">
    <link rel="stylesheet" href="../viewstyle/css/publicform.css">
    <script src="/js/layui/layui.all.js"></script>
    <script src="/admin/js/token.js"></script>
</head>
<style type="text/css">
    .layui-form-label {
        padding: 9px 10px;
        width: 60px;
    }
    .layui-form-item{
        text-align: left;
    }
    .layui-container2{
        padding: 0 15px;
    }
</style>

<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">

                <div class="layui-inline">
                    <label class="layui-form-label">房间号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="telphone" placeholder="输入房间号" autocomplete="off" class="layui-input"
                               id="terminal_room">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">站点编号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="telphone" placeholder="输入站点编号" autocomplete="off" class="layui-input"
                               id="station_bh">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">站点名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="telphone" placeholder="输入站点名称" autocomplete="off" class="layui-input"
                               id="station_name">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">MAC地址</label>
                    <div class="layui-input-inline">
                        <input type="text" name="telphone" placeholder="输入MAC地址" autocomplete="off" class="layui-input"
                               id="terminal_mac">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">锁定状态</label>
                    <div class="layui-input-inline" id="sdzt">
                        <select name="role" id="terminal_lock">
                            <option>请选择</option>
                            <option>正常</option>
                            <option>已锁定</option>
                            <option>审核中</option>
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-admin" lay-submit lay-filter="LAY-user-back-search"
                            id="btnsearch">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>搜索
                    </button>
                </div>
            </div>
        </div>

        <div class="layui-card-body">
            <table class="layui-hide" id="t" lay-filter="t"></table>
        </div>
    </div>
</div>
</body>

<script type="text/html" id="tb">
    <div class="layui-container2">
        <button class="layui-btn layui-btn-sm" lay-event="getAll" onclick="getAll()">导出所有页Excel</button>
    </div>
</script>

<script type="text/html" id="caozuo">
    <button class="layui-btn layui-btn-xs" lay-event="xiangqing">查看详情</button>
    {{#    if (d.terminal_lock=="正常"){   }}
    <button class="layui-btn layui-btn-xs" lay-event="edit">锁定</button>
    {{#  } if(d.terminal_lock=="已锁定") { }}
    <button class="layui-btn layui-btn-xs layui-btn-warm" lay-event="edit">解锁</button>
    {{#  } if(d.terminal_lock=="审核中"){  }}
    <button class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">审核</button>
    {{#  }  }}
    <button class="layui-btn layui-btn-xs" lay-event="shouquan">秘钥授权</button>
</script>

<script>
        var $ = layui.$;
        var table = layui.table
        table.render({
            elem: '#t',
            id: 'tt',
            toolbar: '#tb',
            url: '/admin/terminal/selectTerminal',
            cols: [
                [{
                    field: 'terminal_id',
                    title: '终端编号',
                    width: '8%',
                    align: 'center'
                },
                    {
                        field: 'station_bh',
                        title: '站点编号',
                        width: '8%',
                        align: 'center'
                    },
                    {
                        field: 'terminal_key',
                        title: '密钥',
                        width: '8%',
                        align: 'center'
                    },
                    {
                        field: 'terminal_ip',
                        title: 'IP地址',
                        width: '10%',
                        align: 'center'
                    },
                    {
                        field: 'terminal_mac',
                        title: 'mac地址',
                        width: '10%',
                        align: 'center'
                    },
                    {
                        field: 'terminal_lock',
                        title: '状态',
                        width: '7%',
                        align: 'center',
                        templet: function (d) {
                            return d.terminal_lock;
                        }
                    },
                    {
                        field: 'terminal_room',
                        title: '房间号',
                        width: '9%',
                        align: 'center'
                    },
                    {
                        field: 'station_name',
                        title: '所属站点',
                        width: '10%',
                        align: 'center'
                    },
                    {
                        field: 'terminal_total_online_time',
                        title: '在线时长',
                        width: '10%',
                        align: 'center',
                    },
                    {
                        title: '操作',
                        width: '20%',
                        align: 'center',
                        toolbar: '#caozuo',
                        fixed: 'right'
                    }
                ]
            ],
            page: true
        })

        //搜索事件
        $("#btnsearch").click(function () {
            table.reload('tt', {
                where: {
                    terminal_room: $("#terminal_room").val(),
                    station_bh: $("#station_bh").val(),
                    station_name: $("#station_name").val(),
                    terminal_mac: $("#terminal_mac").val(),
                    terminal_mac: $("#terminal_mac").val(),
                    terminal_lock: $("#terminal_lock").val()
                },
                page: {
                    curr: 1
                }
            });
        });

        //键盘回车监听
        $(window).keypress(function (event) {
            if (event.which === 13) {
                $('#btnsearch').click();
            }
        })

        //监听工具条
        table.on('tool(t)', function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
            var e = obj.event;
            switch(e) {
                case "edit":
                    var neirong = tr.find("button:eq(1)").html();
                    if (neirong == '审核'){
                        layer.msg("此终端正在审核中",{icon:2});
                        return;
                    }
                    var tishi='';
                    if (neirong == '解锁'){
                        tishi="解锁需要审核，您确定解锁吗？";
                    }else{
                        tishi="您确定要锁定吗?";
                    }

                    var sid = layer.confirm(tishi, {
                            title: "提示",
                            btn: ["确定", "取消"]
                        },function(index) {
                            var url = '/admin/terminal/updateLockById';
                            var sendData=data;
                            var adminId=layui.data("local_store").token;
                            sendData.admin_id=adminId;
                            var callback = function(res){
                                var code = res.code;
                                switch(code)
                                {
                                    case 200:
                                        layer.close(sid);
                                        var newSex = res.data.terminal_lock;
                                        layer.msg("修改成功",{icon:1,time:2000});
                                        if (newSex=="正常"){
                                            tr.find("button:eq(1)").html("锁定");
                                            tr[0].cells[5].innerHTML = "正常";
                                            setTimeout(function () {
                                                window.location.reload();
                                            },1000)
                                        }else if (newSex == '已锁定') {
                                            tr.find("button:eq(1)").html("审核");
                                            tr.children("td:eq(5)").html("审核中");
                                        }

                                        setTimeout(function () {
                                            window.location.reload();
                                        },1000)
                                        break;
                                    case 403:{
                                        layer.msg("权限不足",{icon:1,time:1000});
                                        break;
                                    }

                                    default:
                                        layer.msg("修改失败",{icon:1,time:1000});
                                        break;
                                }
                            };
                            $.get(url,sendData,callback);


                        },function (index) {
                            layer.close(sid);
                        }
                    )
                    break;
                case "shouquan":
                    //location = 'add.html';
                    layui.data("s",{key:"terminal",value:data});
                    if (tr[0].cells[2].innerText!= ""){
                        layer.msg("此终端已授权",{icon:2});
                        return;
                    }
                    layer.open({
                            title:"请选择秘钥",
                            content: 'miyao.html',
                            type: 2,
                            area: ['800px', '500px']
                        }
                    );
                    break;

                case "shouquan":
                    //location = 'add.html';
                    layui.data("s", {key: "terminal", value: data});
                    if (tr[0].cells[2].innerText != "") {
                        layer.msg("此终端已授权", {icon: 2});
                        return;
                    }
                    layer.open({
                            title: "请选择秘钥",
                            content: 'miyao.html',
                            type: 2,
                            area: ['100%', '100%']
                        }
                    );
                    break;
                case "xiangqing":
                    layui.data("s", {key: "terminal", value: data});
                    layer.open({
                            title: "查看详情",
                            content: 'ckxq.html',
                            type: 2,
                            area: ['100%', '100%']
                        }
                    );
                    break;
            }
        })

    function getAll(){
        location="/admin/terminal/excelTerminalList";
    }
</script>
</html>
